﻿var cloudninja = cloudninja || {};
cloudninja.metering = cloudninja.metering || {};
cloudninja.metering.charting = cloudninja.metering.charting || {};


//these values will be merged with options of the actual chart
cloudninja.metering.charting.Settings = {
    gauge: {
        seriesDefaults: {
            rendererOptions: {
                intervalOuterRadius: 90,
                intervalColors: ['#eeeeee', '#cc6666']
            }
        }
    },

    axes: {
        axes: {
            xaxis: {
                pad: 2,
                rendererOptions: {
                    //daTickInterval: [1, 'month']
                },
                tickOptions: {
                    formatString: "%m/%d/%Y",
                    showGridline: false
                }
            },
            yaxis: {
                tickOptions: {
                    fontFamily: 'Tahoma',
                    fontSize: '11pt',
                    textColor: '#888888',
                    formatString: '%d&nbsp;kb'
                },
                min: 0
            }
        },
        seriesDefaults: {
            lineWidth: 3,
            showMarker: true,
            shadow: false,
            markerOptions: {syle:"circle"}
        },
        grid: {
            backgroundColor: '#ffffff',
            borderColor: '#cccccc',
            gridLineColor: '#cccccc',
            shadow: false
        },
        seriesColors: ["#4aa5ca", "#c080cf", "#999999"]
    }
};


cloudninja.metering.charting.GaugeRenderer = function (maxValue, threshold) {
    this.maxValue = maxValue;

    this.ticksNumber = 5;

    this.threshold = threshold;

    this.ticks = [];

    this.intervals = [];

    for (var i = 0; i < this.ticksNumber + 1; i++) {
        this.ticks.push(i * this.maxValue / this.ticksNumber);
    }

    this.intervals.push(this.threshold * this.maxValue / 100);
    this.intervals.push(this.maxValue);

    this.render = function (containerId, label, value) {
        $.jqplot(containerId, [[value]], $.extend(true,
            cloudninja.metering.charting.Settings.gauge,
            {
                seriesDefaults: {
                    renderer: $.jqplot.MeterGaugeRenderer,
                    rendererOptions: {
                        label: label,
                        ticks: this.ticks,
                        intervals: this.intervals
                    }
                }
            }));
    };
};

cloudninja.metering.charting.ChartRenderer = {
    renderAxes: function (containerId, series) {
        $.jqplot(containerId, series, $.extend(true,
            cloudninja.metering.charting.Settings.axes,
            {
                axes: {
                    xaxis: {
                        renderer: $.jqplot.CategoryAxisRenderer
                    },
                    yaxis: {
                        labelRenderer: $.jqplot.CanvasAxisLabelRenderer
                    }
                }
            }));
    }
};
